﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<Sisocana.Core.Models.ONGDefinidaModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Defining a ONG for a site
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="HeaderContent" runat="server">
<script src="<%: Url.Content("~/Scripts/jquery-ui-1.8.11.js") %>" type="text/javascript"></script>

</asp:Content>



<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<h2> Defining a ONG for a site</h2>
  <script src="<%: Url.Content("~/Scripts/jquery-ui-1.8.11.js") %>" type="text/javascript"></script>
    <link href="<%: Url.Content("~/Content/themes/base/jquery.ui.all.css") %>" rel="stylesheet" type="text/css" />

    <script language="javascript" type="text/javascript">
        $(document).ready(function () {
            $("p a, input:submit,input:file ").button();
        });
    </script>
<script src="<%: Url.Content("~/Scripts/jquery.validate.min.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js") %>" type="text/javascript"></script>
<style type="text/css">
    table {
        border: 0px solid #E8EEF4;

    }
    table td {
        border: 0px solid #E8EEF4;
    }
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
    var initialLocation;
    var fing = new google.maps.LatLng(60, 105);
    var browserSupportFlag =  new Boolean();
    $(document).ready(function () {
        var latlng = new google.maps.LatLng(-34.91799473178151, -56.166508197784424);
        var options = {
            zoom: 14,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.TERRAIN
        };
        var googleMap = new google.maps.Map($("#map")[0], options);

        if(navigator.geolocation) {
            browserSupportFlag = true;
            navigator.geolocation.getCurrentPosition(function(position) {
            latlng = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
            googleMap.setCenter(latlng);
            }, function() {
                latlng = new google.maps.LatLng(-34.91799473178151, -56.166508197784424);
            });
        }
        var marker = new google.maps.Marker({
            position: latlng,
            map: googleMap,
        });
        marker.setDraggable(true);
        marker.setVisible(false);
        google.maps.event.addListener(googleMap, 'click', function (event) {
            marker.setPosition(event.latLng);
            marker.setVisible(true);    
            googleMap.setCenter(event.latLng);
            $("#CoordX").val(event.latLng.lat());
            $("#CoordY").val(event.latLng.lng());
        });
        google.maps.event.addListener(marker, 'dragend', function (event) {
            marker.setPosition(event.latLng);
            marker.setVisible(true);    
            googleMap.setCenter(event.latLng);
            $("#CoordX").val(event.latLng.lat());
            $("#CoordY").val(event.latLng.lng());
        });

    });
</script>

<% using (Html.BeginForm()) { %>
    <%: Html.ValidationSummary(true) %>
    <fieldset>
        <legend>Ong information</legend>
        <%: Html.HiddenFor(model => model.sitioId) %>
        <div class="editor-label">
            <%: Html.LabelFor(model => model.ongName,"ONG") %>
        </div>
        <div class="editor-field">
            <%: Html.DropDownList("ongName")%>
        </div>

        <div class="editor-label">
            <%: Html.LabelFor(model => model.nombreONGDefinida) %>
        </div>
        <div class="editor-field">
            <%: Html.EditorFor(model => model.nombreONGDefinida) %>
            <%: Html.ValidationMessageFor(model => model.nombreONGDefinida) %>
        </div>

        <div class="editor-label">
            <%: Html.LabelFor(model => model.telefono) %>
        </div>
        <div class="editor-field">
            <%: Html.EditorFor(model => model.telefono) %>
            <%: Html.ValidationMessageFor(model => model.telefono) %>
        </div>

        <div class="editor-label">
            <%: Html.LabelFor(model => model.paypalLogin) %>
        </div>
        <div class="editor-field">
            <%: Html.EditorFor(model => model.paypalLogin) %>
            <%: Html.ValidationMessageFor(model => model.paypalLogin) %>
        </div>

        <div class="editor-label">
            <%: Html.LabelFor(model => model.paypalPartner) %>
        </div>
        <div class="editor-field">
            <%: Html.EditorFor(model => model.paypalPartner) %>
            <%: Html.ValidationMessageFor(model => model.paypalPartner) %>
        </div>
    </fieldset>
    <fieldset>
        <legend>ONG Location</legend>
        <table style="width:100%; height:100%;" >
            <tr>
                <td>
                    <div class="editor-label">
                        <%: Html.LabelFor(model => model.Pais) %>
                    </div>
                    <div class="editor-field">
                        <%: Html.EditorFor(model => model.Pais)%>
                        <%: Html.ValidationMessageFor(model => model.Pais)%>
                    </div>
                    <div class="editor-label">
                        <%: Html.LabelFor(model => model.Ciudad) %>
                    </div>
                    <div class="editor-field">
                        <%: Html.EditorFor(model => model.Ciudad)%>
                        <%: Html.ValidationMessageFor(model => model.Ciudad)%>
                    </div>
                    <div class="editor-label">
                        <%: Html.LabelFor(model => model.Estado) %>
                    </div>
                    <div class="editor-field">
                        <%: Html.EditorFor(model => model.Estado)%>
                        <%: Html.ValidationMessageFor(model => model.Estado)%>
                    </div>
                    <div class="editor-label">
                        <%: Html.LabelFor(model => model.Dir) %>
                    </div>
                    <div class="editor-field">
                        <%: Html.EditorFor(model => model.Dir)%>
                        <%: Html.ValidationMessageFor(model => model.Dir)%>
                    </div>
                    <div class="editor-label">
                        <%: Html.LabelFor(model => model.CP) %>
                    </div>
                    <div class="editor-field">
                        <%: Html.EditorFor(model => model.CP)%>
                        <%: Html.ValidationMessageFor(model => model.CP)%>
                    </div>
                    <%: Html.HiddenFor(model => model.CoordX) %>
                    <%: Html.HiddenFor(model => model.CoordY) %>
        
                </td>
                <td align="center">
                    <div id="map" style="width:500px; height:300px"></div>
             </td>
        </tr>
    </table>
    </fieldset>
    <p>
        <input type="submit" value="Create" />
    </p>
<% } %>

<div>
    <%: Html.ActionLink("Back to List", "Conf", new { idsitio = Model.sitioId, tab = 8 })%>
</div>

</asp:Content>


